<template>
    <data-form ref="dataFormRef" :rule-field="['title', 'server', 'authorization']" :model="form" description="会话">
        <el-form-item v-show="false" prop="id">
            <el-input v-model="form.id"/>
        </el-form-item>

        <el-form-item label="连接名称" prop="title">
            <el-input v-model="form.title" clearable placeholder="连接名称"/>
        </el-form-item>

        <el-form-item label="服务地址" prop="server">
            <el-input v-model="form.server" clearable placeholder="例如:127.0.0.1:9256;127.0.0.1:9257"/>
        </el-form-item>

        <el-form-item label="用户认证" prop="authorization">
            <el-input v-model="form.authorization" clearable placeholder="digest/auth:用户名:密码"/>
        </el-form-item>

        <el-form-item label="连接超时" prop="connectionTimeout">
            <el-input-number v-model="form.connectionTimeout" :min="1000" :step="1000"/>
            <el-link :underline="false" style="font-size: 12px" type="info">&nbsp;&nbsp;单位:毫秒</el-link>
        </el-form-item>

        <el-form-item label="初始路径" prop="forPath">
            <el-input v-model="form.forPath" clearable placeholder="路径必须以‘/’开头和连接"/>
        </el-form-item>
    </data-form>
</template>

<script lang="ts" setup>
import {ref} from "vue";
import DataForm from '@/components/data-form/index.vue'

const props = defineProps({
    owner: {
        type: Number
    }
})

const dataFormRef = ref<InstanceType<typeof DataForm>>();
const form = ref({
    id: null,
    title: null,
    server: null,
    authorization: null,
    connectionTimeout: 60000,
    forPath: '/',
    owner: props.owner
});

// 展示弹窗
const open = (options: OpenFormConfig) => {
    dataFormRef.value.open(options)
};

defineExpose({open})
</script>